<script lang="ts">
export default {
  name: "engineerWithdrawList"
}
</script>
<script setup lang="ts">
import { onMounted, reactive, ref, toRefs, getCurrentInstance } from 'vue';
import { TableInstance } from 'element-plus'
import {
  getEngineerWithdrawList
} from '@/api/engineer/index';
import {EngineerWithdrawQuery} from "@/api/engineer/types";
import {Withdrawal} from "@/api/system/withdrawal/types";
const dataTableRef = ref<TableInstance>()
const { proxy }: any = getCurrentInstance();
defineExpose({
  open
});
const state = reactive({
  dialog: {
    title: '工程师提现记录列表',
    visible: false,
  } as DialogType,
  queryParams: {
    engineerId: undefined,
    pageNum: 1,
    pageSize: 10,
  } as EngineerWithdrawQuery,
  engineerWithdrawList: [] as Withdrawal[],
  total: 0,
  loading: true,
})

let {
  dialog,
  queryParams,
  engineerWithdrawList,
  total,
  loading
} = toRefs(state);


function cancel() {
  dialog.value.visible = false;
}

async function handleQuery() {
  loading.value = true;
  let {data} = await getEngineerWithdrawList(queryParams.value);
  state.engineerWithdrawList = data.list;
  state.total = data.total;
  state.loading = false;
}

function open(engineerId:number) {
  console.log("row", engineerId)
  dialog.value.visible = true;
  queryParams.value.engineerId = engineerId
  handleQuery()
}

</script>

<template>
  <el-dialog :title="dialog.title" v-model="dialog.visible" width="1200px" heigh=t destroy-on-close @close="cancel">
    <el-card>
      <el-table
        ref="dataTableRef"
        v-loading="loading"
        :data="engineerWithdrawList"
        height="400"
        highlight-current-row
        border
      >
        <!--        <el-table-column type="selection" width="55" align="center" />-->
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="用户名称" prop="engineerName" min-width="150"/>
        <el-table-column label="银行卡号" prop="cardNo" min-width="150" />
        <el-table-column label="开户行" prop="cardAddress" min-width="150" />
        <el-table-column label="开户名" prop="cardName" min-width="150" />
        <el-table-column label="提现金额" prop="money" width="160">
        </el-table-column>
        <el-table-column label="是否审核" prop="isCheckName" width="190" />
        <el-table-column label="失败原因" prop="remark" width="190" />
      </el-table>

      <!-- pagination -->
      <pagination
        v-if="total > 0"
        :total="total"
        v-model:page="queryParams.pageNum"
        v-model:limit="queryParams.pageSize"
        @pagination="handleQuery"
      />
    </el-card>
  </el-dialog>
</template>

<style scoped>

</style>

